
@import '../common/constant.less';

.answer-score{


    .info-area {
        @score-border-color: #D8D8D8;
        @score-color-blue:#55A3FF;
        @score-font-size:22px;

        p {
            margin: 0;
        }
        

        padding: @page-hor-margin;

        color: black;
        background-color: white;
        border-radius: @window-radius;
        

        .score-area{
            border-bottom-style: solid;
            border-color:@score-border-color;
            border-width: 1px;

            font-size: @score-font-size;

            .score-title {
                
            }

            .score-info {
                display: flex;
                align-items: center;
                justify-content: space-between;


                .score-number {
                    flex-basis: 80px;
                    flex-grow: 0;
                    flex-shrink: 0;

                    color: @vote-man-red;
                    
                    font-size: 85px;
                    font-weight: 900;

                }


                .score-describe{
                    flex-basis: content;


                    .title-count {
                        display: block;

                        .title-number {
                            color: @vote-man-red;
                        }

                    }

                    .time-count {
                        display: block;

                        .time-number {
                            color: @score-color-blue;
                        }

                    }




                }

            }

        }


        .award-area {

        .title-area {
            display: flex;
            justify-content: space-between;


        .award-words {
            font-size: @score-font-size;
        }

        .use-action {
            color: @vote-man-red;
        }

        }


        .coupon-area {
            @coupon-color-red:#eb4e4e;
            @coupon-color-yellow: #ffdb2c;


            display: flex;
            padding: 0;

            


            .coupon{

                overflow: hidden;

                list-style-type: none;

                background-color: @coupon-color-red;
                border-color: @coupon-color-yellow;
                border-radius: 10px;

                color: white;

                flex-basis: 140px;


                .coupon-desc {

                    .coupon-price {
                        font-size: 28px;
                    }

                }


                .use-desc {
                    font-size: 12px;

                    display: flex;
                    justify-content: space-between;

                    .use-left ,use-right{
                        flex-basis: content;
                        flex-shrink: 1;
                    }

                    .use-center {
                        flex-basis: content;
                        flex-shrink: 0;

                    }

                }


            }

        }


        }
        

        
    }




    .action-area {
        @action-height:48px;
        @action-width:70%;

        margin-top: 24px;

        text-align: center;
    
    
    
        .answer-action {

            display: block;
          color: @vote-man-red;
          background-color: white;
    
          width: @action-width;
    
          margin-left: auto;
          margin-right: auto;
    
          .radius-vertical-center(@action-height);
    
        }
    

        .action-dect {
            margin-top:24px;
            margin-bottom: 0px;
        }
    
        .share-action {

            margin-top: 16px;
    
          background-color: @vote-man-red;
    
          width: @action-width;
    
          margin-left: auto;
          margin-right: auto;
    
    
    
          .radius-vertical-center(@action-height);
    
        }
    
      }




      .share-instr-area {

        position: fixed;
        width: 100vw;
        height: 100vh;
      
        left: 0;
        top:0;
      
        background-color: RGBA(0,0,0,0.5);



        .share-instr {
            position: fixed;
            right: 32px;
            top:32px;
  
            width: 100px;
            height: 100px;
  
            background-color: red;
        }

      }
      

}